<style>
  body {
    background-color: deeppink;

  }

  div {
    position: relative;
    left: 400px;
    width: 100px;
    height: 100px;
    background-color: #fff;
    border-radius: 45%;
    animation-name: rotate;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-duration: 10s;
  }


  /* 波浪核心代码 */
  @keyframes rotate {
    0% {
      transform: rotateZ(0deg);
    }

    50% {
      transform: rotateZ(180deg);
    }

    100% {
      transform: rotateZ(360deg);
    }
  }
</style>


<div></div>